<template>
  <el-dialog
    class="gl_dialog_TitleLine"
    width="1080px"
    :title="title"
    :visible.sync="dialogVisible"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    append-to-body
  >
    <div v-if="dialogVisible">
      <!-- 个人称重 -->
      <div v-if="weightingType === 'I'">
        <el-table v-loading="loading" :data="tableData" stripe size="mini" style="width: 100%;" height="500px">
          <!-- 序号 -->
          <el-table-column type="index" label="序号" align="center" width="60" />
          <!-- 运动员头像 -->
          <el-table-column label="头像" align="center" width="100">
            <template slot-scope="{row}">
              <img class="athletePhoto" :src="getStaticFileUrl(row.sourceRegister && row.sourceRegister.imagePath)" alt="" @error="errorPhoto">
            </template>
          </el-table-column>
          <!-- 姓名 -->
          <el-table-column prop="sourceRegister.name" label="姓名" width="130" />
          <!-- 证件号 -->
          <el-table-column prop="sourceRegister.idCardNumber" label="证件号" width="160" align="center" />
          <!-- 所属机构 -->
          <el-table-column prop="delegation.name" label="所属机构" min-width="180" />
          <!-- 一次称重(KG) -->
          <el-table-column prop="weight1" label="一次称重(KG)" width="120" align="center">
            <template slot-scope="{row}">
              <div v-for="item in row.entrys" :key="item.id" class="weighingsIsValid">{{ !item.weight1 && item.weight1 !== 0 ? '--' : item.weight1 }}</div>
            </template>
          </el-table-column>
          <!-- 二次称重 -->
          <el-table-column prop="weight2" label="二次称重(KG)" width="120" align="center">
            <template slot-scope="{row}">
              <div v-for="item in row.entrys" :key="item.id" class="weighingsIsValid">{{ !item.weight2 && item.weight2 !== 0 ? '--' : item.weight2 }}</div>
            </template>
          </el-table-column>
        </el-table>
        <el-row class="gl_pt_20" style="text-align: center;">
          <el-pagination
            :current-page="Api_GET_EventsManagementWeighingQO.Page"
            :page-size="Api_GET_EventsManagementWeighingQO.MaxResultCount"
            :total="totalPage"
            layout="total,sizes,prev,pager,next,jumper"
            :page-sizes="[10, 20, 30, 40]"
            @size-change="sizeChange"
            @current-change="pageIndexChange"
          />
        </el-row>
      </div>
      <!-- 团体称重 -->
      <div v-else>
        <el-table v-loading="loading" :data="tableData" stripe size="mini" default-expand-all style="width: 100%;" height="500px">
          <el-table-column type="expand">
            <template slot-scope="props">
              <el-table :data="props.row.entrys[0].memberEntrys" stripe size="mini" :summary-method="getSummaries" show-summary style="width: 100%;">
                <!-- 运动员头像 -->
                <el-table-column label="头像" align="center" width="100">
                  <template slot-scope="{row}">
                    <img class="athletePhoto" :src="getStaticFileUrl(row.competitionRegister.sourceRegister && row.competitionRegister.sourceRegister.imagePath)" alt="" @error="errorPhoto">
                  </template>
                </el-table-column>
                <!-- 姓名 -->
                <el-table-column label="姓名" width="200">
                  <template slot-scope="{row}">
                    <div>{{ row.competitionRegister.name }}{{ row.weightClass && row.weightClass.name ? ' (' + row.weightClass.name + ') ' : '' }}</div>
                  </template>
                </el-table-column>
                <!-- 证件号 -->
                <el-table-column prop="competitionRegister.sourceRegister.idCardNumber" label="证件号" min-width="180" align="center" />
                <!-- 一次称重(KG) -->
                <el-table-column prop="weight1" label="一次称重(KG)" width="120" align="center">
                  <template slot-scope="{row}">
                    <div>{{ !row.weight1 && row.weight1 !== 0 ? '--' : row.weight1 }}</div>
                  </template>
                </el-table-column>
                <!-- 二次称重 -->
                <el-table-column prop="weight2" label="二次称重(KG)" width="120" align="center">
                  <template slot-scope="{row}">
                    <div>{{ !row.weight2 && row.weight2 !== 0 ? '--' : row.weight2 }}</div>
                  </template>
                </el-table-column>
              </el-table>
            </template>
          </el-table-column>
          <el-table-column type="selection" label-class-name="selection" />
          <!-- 序号 -->
          <el-table-column type="index" label="序号" align="center" width="60" />
          <!-- 名称 -->
          <!-- <el-table-column prop="name" label="名称" width="200" /> -->
          <el-table-column label="名称" min-width="200">
            <template slot-scope="{row}">
              <div v-for="item in row.entrys" :key="item.id" class="event_Name">{{ item.event.eventGroup.category.name + " " || '' }} {{ item.event.eventGroup.name + " " || '' }} {{ item.event.name + " " || '' }} {{ item.teamNo ? item.teamNo+ "组" : '' }}</div>
            </template>
          </el-table-column>
          <!-- 所属机构 -->
          <el-table-column prop="delegation.name" label="所属机构" min-width="220" />
        </el-table>
        <el-row class="gl_pt_20" style="text-align: center;">
          <el-pagination
            :current-page="Api_GET_EventsManagementWeighingQO.Page"
            :page-size="Api_GET_EventsManagementWeighingQO.MaxResultCount"
            :total="totalPage"
            layout="total,sizes,prev,pager,next,jumper"
            :page-sizes="[10, 20, 30, 40]"
            @size-change="sizeChange"
            @current-change="pageIndexChange"
          />
        </el-row>
      </div>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" size="mini" @click="dialogVisible = false">确 定</el-button>
    </div>
  </el-dialog>
</template>
<script>
// import { CopyData } from '@/lib';
import { Api_GET_EventsManagementWeighingQO } from '@/lib/form/game/swaggerForm';
import defaultGameLogo from '@/assets/images/face_default.png';
import {
  api_GET_EventsManagementWeighing
} from '@/extend/api/gameswaggerApi/app';
export default {
  name: 'EditSchedule',
  data() {
    return {
      defaultGameLogo: defaultGameLogo,
      loading: false,
      currentPage: 1,
      totalPage: 0,
      title: '',
      Api_GET_EventsManagementWeighingQO: new Api_GET_EventsManagementWeighingQO(),
      tableData: [],
      dialogVisible: false,
      weightingType: '' // 控制显示是团体还是个人
    };
  },
  created() {
    this.gameId = this.$route.params.id;
  },
  methods: {
    open(row, categoryId) {
      const _name = row.categoryName + ' ' + row.groupName + row.gender.name + row.eventName;
      console.log(row);
      this.title = '体重查看 - ' + _name;
      this.tableData = [];
      this.Api_GET_EventsManagementWeighingQO = new Api_GET_EventsManagementWeighingQO();
      this.weightingType = row.registerTypeCode;
      this.dialogVisible = true;
      this.Api_GET_EventsManagementWeighingQO.CategoryId = categoryId || '';
      this.Api_GET_EventsManagementWeighingQO.EventGroupId = row.groupId || '';
      this.Api_GET_EventsManagementWeighingQO.EventId = row.eventId || '';
      // 已通过 ： IsAllForValidStatus == false && Api_GET_EventsManagementWeighingQO.IsValid == true
      this.Api_GET_EventsManagementWeighingQO.IsAllForValidStatus = false;
      this.Api_GET_EventsManagementWeighingQO.IsValid = true;
      this.Api_GET_EventsManagementWeighingQO.IsIndividual = this.weightingType === 'I'; // 个人是true
      this.refreshList();
    },
    // 刷新列表
    refreshList(page) {
      this.loading = true;
      this.Api_GET_EventsManagementWeighingQO.Page = page || 1;
      this.Api_GET_EventsManagementWeighingQO.SkipCount = (this.Api_GET_EventsManagementWeighingQO.Page - 1) * this.Api_GET_EventsManagementWeighingQO.MaxResultCount;
      this.Api_GET_EventsManagementWeighingQO.CompetitionId = this.$route.params.id;
      console.log(this.Api_GET_EventsManagementWeighingQO);
      api_GET_EventsManagementWeighing(this.Api_GET_EventsManagementWeighingQO).then(res => {
        console.log(res);
        this.tableData = res.items;
        this.totalPage = res.totalCount;
        this.loading = false;
      }, () => {
        this.$message({ type: 'error', message: '获取称重列表失败' });
      });
    },
    // 称重表格合计的自定义计算
    getSummaries(param) {
      const { columns, data } = param;
      const sums = [];
      // eslint-disable-next-line no-unused-vars
      let weight1 = [0, 0];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计';
          return;
        }
        if (index === 3 || index === 4) {
          const values = data.map(item => item[column.property] === null || item[column.property] === '' ? null : Number(item[column.property]));
          if (index === 3) {
            weight1 = values;
          }
          if (index === 4) {
            if (!values.every(value => value === null)) {
              for (let i = 0; i < values.length; i++) {
                // eslint-disable-next-line eqeqeq
                values[i] = values[i] == null ? weight1[i] : values[i];
              }
            }
          }
          if (!values.every(value => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr);
              if (!isNaN(value)) {
                return ((prev * 100 + curr * 100) / 100).toFixed(2);
              } else {
                return prev;
              }
            }, 0);
            // sums[index] += ' 元';
          } else {
            sums[index] = '--';
          }
        }
      });

      return sums;
    },
    // 获取静态文件
    getStaticFileUrl(relativeUrl) {
      if (!relativeUrl) return '';
      return WEB_CONFIG.VUE_APP_STATIC_FILE_RUL + relativeUrl;
    },
    errorPhoto() {
      const img = event.srcElement;
      img.src = this.defaultGameLogo;
    },
    sizeChange(MaxResultCount) {
      this.Api_GET_EventsManagementWeighingQO.MaxResultCount = MaxResultCount;
      this.refreshList();
    },
    pageIndexChange(currentPage) {
      this.refreshList(currentPage);
    }
  }
};
</script>
<style lang="scss" scoped>
  .athletePhoto{
    width: 60px;
    height: 70px;
    vertical-align: middle;
  }
  // .weighingsIsValid{
  //   min-height: 23px;
  // }
  // .actions_div{
  //   display: inline-block;
  //   vertical-align: middle;
  // }
  // .event_Name{
  //   padding: 2px 0;
  // }
</style>

